import React, { Component } from 'react';
import { Affix, Button, Form } from 'antd';
import { messages } from 'share/common';
import Selector from 'components/selector';

@Form.create()
class EditInvoiceControls extends Component {

  formItemLayout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 12, offset: 1 }
  };

  handleSave = () => {
    const { form: { validateFieldsAndScroll },  dataIndex } = this.props;
    validateFieldsAndScroll(async (errors, values) => {
      if (!errors) {
        this.props.close({ ...values, dataIndex });
      }
    });
  };

  handleCancel = () => {
    this.props.close();
  };

  render() {
    const { fieldList, form: { getFieldDecorator } } = this.props;
    const { params: { receiptTypeNo, receiptType, invoiceCheckDesc } } = this.props;
    return (
      <section className="edit-invoice-control">
        <Form className="new-form">
          <p className='new-form-explain'>
            {messages('expense-3.key181',{arg1: invoiceCheckDesc,arg2: receiptType,arg3: receiptTypeNo})/*当法人查验为“{arg1}”时，{arg2}（{arg3}）发票字段管控如下：*/}
            { '\n' }
            {messages('expense-3.key182')/*说明：如果存在置灰不可更改配置的字段，则表示该系统要求必须按此条件配置管控。*/}
          </p>
          {
            fieldList.map(item =>
              <Form.Item {...this.formItemLayout} label={item.fieldLabel}>
                {
                  getFieldDecorator(item.valueCode, {
                    rules: [{
                      required: item.required === 'Y',
                      message: messages('expense-3.key78')/*请输入temp2*/ + item.fieldLabel
                    }],
                    initialValue: { id: item.value, name: item.valueDesc },
                  })(
                    <Selector
                      type='invoice-check-created'
                      params={item.dataConfig}
                      entity
                      disabled={item.readOnly}
                    />
                  )
                }
              </Form.Item>)
          }
          <Affix offsetBottom={0} className="slide-footer">
            <Button type="primary" htmlType="submit" onClick={this.handleSave}>
              {messages('common.ok')/*确定*/}
            </Button>
            <Button onClick={this.handleCancel} className="new-unit-cancel">
              {messages('common.cancel')/*取消*/}
            </Button>
          </Affix>
        </Form>
      </section>
    );
  }
}

EditInvoiceControls.propTypes = {};

export default EditInvoiceControls;
